<template>
  <div class="app-container">
    <div class="left-container">
      <span style="font-size: 30px; font-weight: 900; color: var(--el-color-primary)">我的队伍</span>
      <teamInfoDel :teamInfo="teamInfo" :currentStudentId="currentStudentId" style="margin-top: 2%"></teamInfoDel>
      <teamPage :teamInfo="teamInfo" :currentStudentId="currentStudentId" :currentStuId="currentStuId"></teamPage>
    </div>
    <div class="right-container">
      <teacherList :teacher="teamInfo?.team?.teamTeachers.sort((a, b) => a.sort - b.sort)" :group="teamInfo?.team?.group"></teacherList>
    </div>
  </div>
</template>
<script setup>
import { getUserProfile } from '@/api/system/user'
import { ref, onMounted } from 'vue'
import teamPage from './components/teamPage.vue'
import teamInfoDel from './components/teamInfoDel.vue'
import teacherList from './components/teacherList.vue'
import { useRouter } from 'vue-router'
import {ElMessage} from 'element-plus'
const router = useRouter()
const teamInfo = ref({})
const currentStudentId = ref(null)
const currentStuId = ref(null)
onMounted(async () => {
  const res = await getUserProfile()
  teamInfo.value = res?.data?.data?.student?.studentTeam
  if (!teamInfo.value) {
    router.push('/index/student')
    ElMessage.error('您还未加入队伍，请先加入队伍')
    return
  }
  currentStudentId.value = res?.data?.data?.student?.studentId ?? null
  currentStuId.value = res?.data?.data?.student?.stuId ?? null
})
</script>
<style scoped lang="scss">
$padding: 24px;
$border-radius: 10px;
$border-bottom: 1px solid #e5e5e5;
$full-height: calc(100dvh - 84px);

.app-container {
  display: flex;
  gap: 24px;
}
.left-container {
  width: 70%;
  height: 100%;
  padding: $padding;
  overflow: auto;
  background-color: #ffffff;
  border-radius: $border-radius;
  border-bottom: $border-bottom;
}
.left-container::-webkit-scrollbar {
  display: none;
}
.right-container {
  width: 30%;
  height: 100%;
  padding: $padding;
  background-color: #ffffff;
  border-radius: $border-radius;
  border-bottom: $border-bottom;
}
</style>